<template>
  <v-sheet width="300" class="mx-auto">
    <v-form @submit.prevent="loginUser">
      <v-text-field v-model="userInfo.userName" label="用户名" :rules="[v => !!v || '请输入用户名']"></v-text-field>

      <v-text-field v-model="userInfo.userAge" label="年龄" type="number"></v-text-field>

      <v-text-field v-model="userInfo.account" label="账号" :rules="[v => !!v || '请输入账号']"></v-text-field>

      <v-text-field v-model="userInfo.phoneNumber" label="手机号" :rules="[v => !!v || '请输入手机号']"></v-text-field>

      <v-text-field v-model="userInfo.password" label="密码" :rules="[v => !!v || '请输入密码']" type="password"></v-text-field>

      <v-btn type="submit" block class="mt-2">创建用户</v-btn>
    </v-form>
  </v-sheet>
</template>
<script setup lang="ts">
import service from '@/api';

const userInfo = ref({
  userName: '',
  userAge: '',
  account: '',
  phoneNumber: '',
  password: '',
})
const loginUser = () => {
  service.post(HttpMap.login, {
    ...userInfo.value
  })
}
</script>
<style scoped></style>
